import React, {Fragment} from 'react';
import {formatMessage} from 'umi/locale';
import DocumentTitle from 'react-document-title';
import Link from 'umi/link';
import {Icon} from 'antd';
import GlobalFooter from '@/components/GlobalFooter';
import SelectLang from '@/components/SelectLang';
import styles from './UserLayout.less';
import config from '@/config';

const copyright = (
  <Fragment>
    Copyright <Icon type="copyright"/> {config.copyrightText}
  </Fragment>
);

class UserLayout extends React.PureComponent {
  // @TODO title
  // getPageTitle() {
  //   const { routerData, location } = this.props;
  //   const { pathname } = location;
  //   let title = 'Ant Design Pro';
  //   if (routerData[pathname] && routerData[pathname].name) {
  //     title = `${routerData[pathname].name} - Ant Design Pro`;
  //   }
  //   return title;
  // }

  render() {
    const {children} = this.props;
    return (
      // @TODO
      <DocumentTitle title={config.appName}>
        <div className={styles.container}>
          <div className={styles.lang}>
            <SelectLang/>
          </div>
          <div className={styles.content}>
            <div className={styles.top}>
              <div className={styles.header}>
                <Link to="/">
                  <img alt="logo" className={styles.logo} src={config.logoSrc}/>
                  <span className={styles.title}>{config.appName}</span>
                </Link>
              </div>
              <div className={styles.desc}></div>
            </div>
            {children}
          </div>
          <GlobalFooter copyright={copyright}/>
        </div>
      </DocumentTitle>
    );
  }
}

export default UserLayout;
